// 1： 导入路由
import {createRouter, createWebHistory} from 'vue-router'


// 2: 创建路由器对象，将模板全部进行路由匹配和注册
const router = createRouter({
    history: createWebHistory(),
    routes: [
        {
            path: "/",
            name: "layout",
            component: () => import("@/layout/layout"),
            redirect: "/index",
            children: [
                // 首页
                {
                    path: "/index",
                    name: "index",
                    meta: {title: "首页"},
                    component: () => import("@/views/index"),
                    // 针对性的处理
                    beforeEnter(to, from) {
                        console.log(to, from)
                    }
                },
                {
                    path: "/user",
                    name: "user",
                    meta: {title: "用户管理"},
                    component: () => import("@/views/user/index"),
                },
                {
                    path: "/serv",
                    name: "serv",
                    meta: {title: "服务管理"},
                    component: () => import("@/views/serv/index")
                },
                {
                    path: "/order",
                    name: "order",
                    meta: {title: "订单管理"},
                    component: () => import("@/views/order/index")
                },
                {
                    path: "/course",
                    name: "course",
                    meta: {title: "课程管理"},
                    component: () => import("@/views/course/index")
                },
                {
                    path: "/product",
                    name: "product",
                    meta: {title: "产品管理"},
                    component: () => import("@/views/product/index")
                },
                {
                    path: "/books",
                    name: "books",
                    meta: {title: "图书管理"},
                    component: () => import("@/views/book/index")
                }
            ]
        },
        {
            path: "/login",
            name: "login",
            meta: {title: "登录页面"},
            component: () => import("@/views/login")
        },
        {
            path: "/error",
            name: "error",
            meta: {title: "错误页面"},
            component: () => import("@/views/error")
        }
    ]
})


// // js方式动态的注册路由
// router.addRoute({
//     path: "/error",
//     name: "error",
//     meta: {title: "错误页面"},
//     component: () => import("@/views/error")
// })

// // js方式动态的注册 父子路由
// router.addRoute("layout",{
//     path: "/course",
//     name: "course",
//     meta: {title: "课程管理"},
//     component: () => import("@/views/course/index")
// })

// 移除一个路由
// router.removeRoute("layout")

// 判断某个路由存在吗
// console.log(router.hasRoute("order"))

// 获取所有的路由
// console.log(router.getRoutes())

/**
 *   1：路由请求进入前置守卫
 参数：
 - to : 当前你访问的路由
 - from : 上次访问的路由
 - next() : 进入下一个守卫，执行的时候必须是next()
 返回值:
 - 返回值1 : return true;  相当于next()的继续执行请求
 - 返回值2 : return false;  终止请求
 - 返回值3 : return {path:""}; 如果你指定path，直接转发到你指定的地址，相当于this.$router.push({path:"/xxx"});
 - 返回值4 : next();  继续执行请求
 */
// 其实就利用：路由的前置防卫来处理拦截。
router.beforeEach((to) => {
    // 错误页面
    if (to.matched.length == 0) {
        return {path: "/error"}
    }
})


// 判断是否登录
router.beforeEach((to) => {
    // 登录页面直接放行
    if (to.fullPath == "/login") {
        // 防止用户重复登陆
        if (localStorage.getItem("token")) {
            return {path: "/index"}
        }
        return true;
    }

    // 失败页面直接放行
    if (to.fullPath == "/error") {
        return true;
    }

    // 1：如果登陆成功，直接访问成功页面
    if (localStorage.getItem("token")) {
        return true;
    } else {
        // 在操作系统，吃了个饭，30min后再访问系统，因为token是有时间限制的，
        // 为了良好的用户体验
        // 将当前路由的完整地址作为参数传递给登录的组件，以便登录之后再回到这个位置！
        localStorage.setItem("gotoAddreess", to.fullPath);
        return {path: "/login"}
    }

})

// 后置防卫，改标题
router.afterEach((to) => {
    document.title = to.meta.title;
})


// 3: 导出模板router模块即可
export default router